.card {
 
  margin: 0 auto;
}

.carditem {

  position: relative;
}

img {
  height: 400px;
  width: 200px;
}

.carditem_side {
  height: 400;
  width: 200px;
  -webkit-transition: all 0.8s ease;
          transition: all 0.8s ease;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;       
  border-radius: 10px;
  overflow: hidden;
  -webkit-box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.15);
          box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.15);
}

.carditem_side_back {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
}

.carditem:hover .carditem_side_font {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.carditem:hover .carditem_side_back {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}
